<template>
  <div class="g3">
    <div class="ks-row-middle mb20 lh1">
      <span style="width: 60px">组件</span>
      <el-select
        v-if="compId && compId!=='noData'"
        v-model="compId"
        filterable
        style="width: 100%"
      >
        <el-option
          v-for="com in list"
          :key="com.key"
          :value="com.key"
          :label="getComLabel(com)"
        />
      </el-select>
      <span v-else>没有数据</span>
    </div>
    <template v-if="compId && compId!=='noData'">
      <div class="ks-row-between mb20 lh1">
        唯一标识：{{ compId }}
      </div>
      <div class="mb20" v-if="block.type==='component_reload'">参数</div>
      <div v-if="block.type==='component_reload'" class="ks-row-between mb20 lh1">
        <span style="width: 100px">查询条件</span>
        <el-switch v-model="showParam" @change="changeShowParam" />
      </div>
    </template>

  </div>
</template>

<script>

import { getAllGetDataComponent, getComLabel } from '../../../utils/component'
export default {
  name: 'CommonComponentSelect',
  props: {
    eventItem: {}, // 需要逻辑编排的对象
    componentItem: {},
    block: {},
    workspace: {}
  },
  components: { },
  computed: {
    compId: {
      get () {
        const blockComponentId = this.block?.getFieldValue('Component')
        return blockComponentId || ''
      },
      set (val) {
        this.block.setFieldValue(val, 'Component')
      }
    },
    requestParam: {
      get () {
        const count = this.block?.paramCount_
        this.showParam = !!count
        return !!count
      },
      set (val) {
        this.block.paramCount_ = val ? 1 : 0
        this.block.updateShape_()
      }
    }
  },
  data () {
    return {
      getComLabel,
      showParam: false,
      formData: {},
      list: [], // 组件列表
      modelName: '' // 模型名称
    }
  },
  watch: {
    'block': {
      handler () {
        this.getBlockData()
      },
      immediate: true
    }
  },
  methods: {
    getBlockData () {
      if (this.block.type === 'component_get_data') {
        this.list = getAllGetDataComponent()
      } else {
        // this.list = getAllTableList() || []
      }
      if (!this.list.length) return
      const blockComponentId = this.block?.getFieldValue('Component')
      if (blockComponentId) {
        this.compId = blockComponentId
      }
    },
    changeShowParam (val) {
      this.requestParam = val
    }
  }
}
</script>

<style scoped>

</style>
